<template>
  <h1>添加</h1>

  <el-form :model="form" label-width="120px">
    <el-form-item label="图片地址" required>
      <el-input v-model="form.img" />
    </el-form-item>

    <el-form-item label="图片提示" required>
      <el-input v-model="form.alt" />
    </el-form-item>

    <el-form-item label="图片链接" required>
      <el-input v-model="form.link" />
    </el-form-item>

    <el-form-item>
      <el-button type="primary" @click="onSubmit">添加</el-button>
    </el-form-item>
  </el-form>
</template>

<script setup lang="ts">
import 'element-plus/dist/index.css'
import { ElMessage } from 'element-plus';
import { reactive } from 'vue'
import service from '../../../ulit/service'
import { useRouter } from 'vue-router';
const $router = useRouter()

const form = reactive({
  img: '',
  alt: '',
  link: ''
})

const onSubmit = () => {
  if (form.img && form.alt && form.link) {
    service({
      url: "/banner/add",
      method: "post",
      data: form
    }).then(res => {
      if (res.data.code === "200") {
        // alert("添加成功")
        ElMessage({
          message: '添加成功',
          type: 'success',
        })
        $router.push("/admin/list")
      }
    })
  } else {
    ElMessage({
      message: '不能为空',
      type: 'error',
    })
    form.img = '',
      form.alt = '',
      form.link = ''
  }
}

</script>

<style></style>